Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(button): circular icon button to appear round at minimum #3039

Merged
merged 4 commits into from
Jun 4, 2024

Conversation

lubber-de
Copy link
Member

Description

Whenever a circular icon button was used to reduce the padding but use text instead of an icon, the button does not appear as a circle at least (that is taken care of for circular label)

By adding a min width to a circular button this gets fixed.
I intentionally added the minwidth directly to circular button (instead of circular icon button) as it saves an extra selector and the default min-width is already reached (because of the larger paddding) when a non icon button is used.

Screenshot

Before

image

After

image

Testcase

Remove CSS to see issue
https://jsfiddle.net/lubber/do4tujhx/18/

@lubber-de lubber-de added type/feat Any feature requests or improvements lang/css Anything involving CSS state/awaiting-reviews Pull requests which are waiting for reviews labels Apr 30, 2024
@lubber-de lubber-de added this to the 2.9.4 milestone Apr 30, 2024
@lubber-de lubber-de merged commit c7c2a5d into fomantic:develop Jun 4, 2024
10 checks passed
@lubber-de lubber-de deleted the circularIconButtonMinWidth branch June 4, 2024 08:30
@lubber-de lubber-de removed the state/awaiting-reviews Pull requests which are waiting for reviews label Jun 4, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
lang/css Anything involving CSS type/feat Any feature requests or improvements
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants